<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@page isELIgnored="true" %>
<html>
<head>
    <title>库存查询</title>
    <%@include file="/comm/head.jsp"%>
</head>
<body>
<div id="root">
    <Collapse value="search">
        <Panel name="search">
            条件查询
            <p slot="content">
                <i-form inline :label-width="80">
                    <form-item label="仓库:">
                        <i-select v-model="kuCunVo.cangkuId" style="width: 110px" filterable>
                            <i-option value="">--不限--</i-option>
                            <i-Option v-for="item in cangkuList" :value="item.id" :key="item.id">{{item.cangkuName}}</i-Option>
                        </i-select>
                    </form-item>
                    <form-item label="商品:">
                        <i-select v-model="kuCunVo.goodsId" style="width: 110px" filterable>
                            <i-option value="">--不限--</i-option>
                            <i-Option v-for="item in goodsList" :value="item.id" :key="item.id">{{item.name}}</i-Option>
                        </i-select>
                    </form-item>


                    <i-button type="primary"icon="ios-search" style="margin-left:20px" @click="pageNo=1;searchCangkukucunList();">搜索</i-button>
                    <i-button type="success"icon="md-sync" @click="kuCunVo={};searchCangkukucunList();pageNo=1"></i-button>
                </i-form>
            </p>
        </Panel>
    </Collapse>
    <i-table :columns="columns" :data="pageResult.rows" :height="300" border stripe @on-row-dblclick="rowClick"  @on-selection-change="tableSelection=arguments[0]">

        <template slot-scope="{row}" slot="ckname">
            <span>{{ row.cangku.cangkuName}}</span>
        </template>

        <template slot-scope="{row}" slot="spname">
            <span>{{ row.goods.name}}</span>
        </template>
        <template slot-scope="{row,index}" slot="action" >
<shiro:hasPermission name="ckkc:zhuan">
                <i-button type="warning" @click="toZhuan(row)" style="margin-left: 30px">转库</i-button>
</shiro:hasPermission>
        </template>
    </i-table>
    <modal  v-model="KuCunFlag" title="库存变动记录" width="700">
        <div style="width: 670px;height: 34px ;border: 0.5px lightgray solid">
            <i-form :label-width="80" >
                <form-item label="仓库:"style="float: left;">
                    <i-select v-model="cangkuKuCun.cangkuId" style="width: 150px;" disabled="disabled">
                        <i-Option v-for="item1 in cangkuList" :value="item1.id" :key="item1.id">{{item1.cangkuName}}</i-Option>
                    </i-select>
                </form-item>
                <form-item label="商品:" style="float: left">
                    <i-select v-model="cangkuKuCun.goodsId" style="width: 150px;" disabled="disabled">
                        <i-Option v-for="item1 in goodsList" :value="item1.id" :key="item1.id">{{item1.name}}</i-Option>
                    </i-select>
                </form-item>
            </i-form>
        </div>
        <i-table style="clear:both;" :columns="Columns1"  :data="mydata" :height="300" border stripe  >
            <template slot-scope="{row}" slot="username">
                <span>{{ row.user.username}}</span>
            </template>
            <template slot-scope="{row}" slot="cangkuName">
                <span>{{ row.cangku.cangkuName}}</span>
            </template>
            <template slot-scope="{row}" slot="name">
                <span>{{ row.goods.name}}</span>
            </template>
            <template  slot-scope="{row}" slot="type">
                <span>{{row.type==1?"入库":"出库"}}</span>
            </template>
        </i-table>
    </modal>
    <modal  v-model="ZhuanKuFlag" title="商品转库" width="400">
        <i-form :label-width="80" >
                <form-item label="当前仓库:">
                    <i-select v-model="cangkuKuCun.cangkuId" style="width: 150px;" disabled="disabled">
                        <i-Option v-for="item1 in cangkuList" :value="item1.id" :key="item1.id">{{item1.cangkuName}}</i-Option>
                    </i-select>
                </form-item>
                <form-item label="商品:" >
                    <i-select v-model="cangkuKuCun.goodsId" style="width: 150px;" disabled="disabled">
                        <i-Option v-for="item1 in goodsList" :value="item1.id" :key="item1.id">{{item1.name}}</i-Option>
                    </i-select>
                </form-item>
                <form-item label="当前数量:" >
                    <i-input v-model="cangkuKuCun.shuliang"style="width: 150px;" size="large" readonly/>
                </form-item>
                <form-item label="转出仓库:">
                    <i-select v-model="cangkuKuCun.cangkuId1" style="width: 150px;">
                        <i-Option v-for="item1 in cangkuList" :value="item1.id" :key="item1.id">{{item1.cangkuName}}</i-Option>
                    </i-select>
                </form-item>
            <form-item label="转出数量:" >
                <i-input v-model="cangkuKuCun.shuliang1"style="width: 150px;" size="large" />
            </form-item>
            </i-form>
<div slot="footer">
    <i-button type="success" @click="toZhuanKu()" style="margin-left: 30px">转库</i-button>
    <i-button  type="primary"  @click="toQuxiao" >取消</i-button>
</div>
    </modal>
    <%--<Page :total="pageResult.total" :page-size="pageSize" @on-change="changePageNo"/>--%>
    <Page :total="pageResult.total"
          :page-size="pageSize"
    <%-- :current.sync="pageNo"--%>
          @on-change="pageNo=arguments[0];searchCangkukucunList();"
    <%--:current.sync="pageNo"-->
<%-- @on-change="searchUserList"--%>

          show-sizer
          :page-size-opts="[5,10,15]"
    <%-- @on-page-size-change="changPageSize"--%>
          @on-page-size-change="pageSize=arguments[0];searchCangkukucunList();"
    />
</div>
<script>
    new Vue({
        el:"#root",
        data:{
            columns:[
                {key:"id",title:"编号",align:"center"},
                {slot:"ckname",title:"仓库",align:"center"},
                {slot:"spname",title:"商品",align:"center"},
                {key:"shuliang",title:"数量",align:"center"},
                {slot:"action",title:"操作",align:"center"},
            ],
            Columns1:[
                {key:"uuid",title:"编号",width:"60",align:"center"},
                {slot:"username",title:"员工",width:"100",align:"center"},
                {key:"opertime",title:"操作日期",width:"130",align:"center"},
                {slot:"cangkuName",title:"仓库",width:"80",align:"center"},
                {slot:"name",title:"商品",width:"120",align:"center"},
                {key:"num",title:"数量",width:"85",align:"center"},
                {slot:"type",title:"类型",width:"70",align:"center"}
            ],
            pageResult:{
                rows:[],
                total:50,
            },
            kuCunVo:{},
            mydata:[],
            goodsList:[],
            cangkuList:[],
            cangkuKuCun:{},
            tableSelection:[],
            pageNo:1,
            pageSize:5,
            KuCunFlag:false,
            ZhuanKuFlag:false
        },
        methods:{
            searchCangkukucunList(){
                axios.get(`${ctx}/kucun/ckkc/search/${this.pageNo}/${this.pageSize}`,{params:this.kuCunVo})
                    .then(({data})=>{
                        this.pageResult=data.result;
                    });
            },

            searchGoodsList(){
                axios.get(`${ctx}/jibenxinxi/sp/list`)
                    .then(({data})=>{
                        this.goodsList=data.result;
                    });
            },
            searchCangkuList(){
                axios.get(`${ctx}/jibenxinxi/ck/list`)
                    .then(({data})=>{
                        this.cangkuList=data.result;
                    });
            },
            rowClick(row,index){//row 该行数据 ，index该行索引
                axios.get(`${ctx}/kucun/kcbdjl/list1?cangkuId=${row.cangkuId}&&goodsId=${row.goodsId}`)
                    .then(({data})=>{
                        this.mydata=data.result;
                        Object.assign(this.cangkuKuCun,row);
                        this.KuCunFlag=true
                    })},
            toZhuan(row){
                Object.assign(this.cangkuKuCun,row);
                if (this.cangkuKuCun.shuliang==0){
                    return  this.$Message.warning("该库存已清零不能转出")
                }
                this.ZhuanKuFlag=true
            },
            toZhuanKu(){
        
                if (this.cangkuKuCun.cangkuId1==null){
                  return  this.$Message.warning("请选择转出仓库")
                }
                if (this.cangkuKuCun.cangkuId1==this.cangkuKuCun.cangkuId){
                    return  this.$Message.warning("不能选择本仓库，请重新选择")
                }
                if (this.cangkuKuCun.shuliang1<=0||this.cangkuKuCun.shuliang1==null){
                    return   this.$Message.warning("转出数量不能为空且必须大于零")
                }
                axios.post(`${ctx}/kucun/ckkc/zhuanku?cangkuId=${this.cangkuKuCun.cangkuId1}&&shuliang=${this.cangkuKuCun.shuliang1}&&goodsId=${this.cangkuKuCun.goodsId}`,this.cangkuKuCun)
                    .then(({data})=>{
                        this.cangkuKuCun={};
                        this.ZhuanKuFlag=false;
                        this.searchCangkukucunList();
                        iview.Message.success({content:data.msg});
                    })
            },
            toQuxiao(){
                this.ZhuanKuFlag=false
                this.cangkuKuCun={};
                this.$Message.warning("已取消转库")
            }
        },
        mounted(){
            this.searchCangkukucunList();
            this.searchGoodsList();
            this.searchCangkuList();
    }
    });
</script>
</body>
</html>
